<!--供应商管理 基本信息视图-->
<template>
  <div class="m-view-baseInfo m-window">
    <div class="m-agTable">
      <el-form
        :model="ruleForm"
        ref="ruleForm"
        label-width="110px"
        :rules="rules"
        :inline-message="true"
      >
        <el-row :gutter="10">
          <el-col :span="12" v-if="show">
            <el-form-item label="简称：">
              <el-input v-model="ruleForm.shortName" placeholder="请输入简称" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="行业类型：" v-if="show">
              <el-input v-model="ruleForm.industryType" placeholder="行业类型" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col>
            <el-form-item label="主营产品：" v-if="show">
              <el-input v-model="ruleForm.mainProducts" placeholder="主营产品" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col>
            <el-form-item label="经营范围：" v-if="show">
              <el-input v-model="ruleForm.scope" placeholder="经营范围" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="国家：" v-if="show">
              <el-input v-model="ruleForm.country" disabled="disabled"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="地区：" v-if="show">
              <el-input v-model="ruleForm.area" disabled="disabled"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="法人代表：" v-if="show">
              <el-input v-model="ruleForm.legalPerson" placeholder="法人代表" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="注册时间：" v-if="show">
              <el-date-picker
                v-model="ruleForm.registeredDate"
                placeholder="注册时间"
                value-format="yyyy-MM-dd HH:mm:ss"
              ></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="注册资金：" prop="registeredCapital" v-if="show">
              <el-input v-model="ruleForm.registeredCapital" placeholder="注册资金" clearable></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="编号:">
              <el-input v-model="ruleForm.supplierCode" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="分类:">
              <el-select v-model="ruleForm.categoryCode" disabled>
                <el-option
                  v-for="item in categoryOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="名称：">
              <el-input v-model="ruleForm.supplierName" placeholder disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="电子签状态：">
              <el-input v-model="ruleForm.isESign" placeholder disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="签章人：" prop="linkMan">
              <!--联系人-->
              <el-input v-model="ruleForm.linkMan" placeholder="签章人(50字)" clearable maxlength="50" :disabled="mode=='view'"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="签章人手机：" prop="linkNumber">
              <el-input
                v-model="ruleForm.linkNumber"
                placeholder="请输入手机号码(11位)"
                clearable
                :disabled="mode=='view'"
                maxlength="11"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="公司电话：" prop="phone">
              <el-input v-model="ruleForm.phone" maxlength="20" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="传真：" prop="fax">
              <el-input v-model="ruleForm.fax" maxlength="20" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="邮件：" prop="mail">
              <el-input v-model="ruleForm.mail" placeholder="邮件(20字)" :disabled="mode=='view'" clearable maxlength="20"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="7">
            <el-form-item label="信用代码：">
              <el-input v-model="ruleForm.creditCode" clearable disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="17">
            <el-form-item label="地址：">
              <el-input v-model="ruleForm.address" clearable disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col>
            <el-form-item label="备注：" prop="remark">
              <el-input
                v-model="ruleForm.remark"
                placeholder="备注(200字)"
                clearable
                type="textarea"
                maxlength="200"
                :disabled="mode=='view'"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
  </div>
</template>

<script>
import { categoryCode } from "@/public/enum";
export default {
  data () {
    var checkVal = (rule, value, callback) => {
      setTimeout(() => {
        var reg = new RegExp("^\\d{1,11}$|^\\d{1,11}[.]\\d{1,8}$");
        if (!reg.test(value)) {
          callback(new Error("请输入数字类型"));
        }
        else
          callback();
      }, 100);
    };
    var checkTel = (rule, value, callback) => {
      setTimeout(() => {
        var reg = /^1(3[0-9]|4[0-9]|5[0,1,2,3,5,6,7,8,9]|6[0-9]|7[0-9]|8[0-9]|9[0-9])\d{8}$/;
        if (value != '' && value != undefined) {
          if (!reg.test(value)) {
            callback(new Error("请输入11位符合要求的手机号码"));
          } else
             callback();
        } else if (value == undefined) {
          callback();
        } else {
          callback();
        }
      }, 100);
    };
    var checkMail = (rule, value, callback) => {
      setTimeout(() => {
        var reg = new RegExp("^([0-9A-Za-z\-_\.]+)@([0-9a-z]+\.[a-z]{2,3}(\.[a-z]{2})?)$");
        if (value) {
          if (!reg.test(value.toLowerCase().trim())) {
            callback(new Error("请输入正确的邮箱地址"));
          } else
             callback();
        } else
           callback();
      }, 100);
    };
    return {
      ruleForm: {
        mail: '',
        linkNumber: ''
      },
      rules: {
        registeredCapital: [{
          validator: checkVal,
          trigger: "change"
        }],
        linkNumber: [{
          // required:true,
          validator: checkTel,
          trigger: "change"
        }],
        mail: [{
          //required:true,  //jjc20181112
          validator: checkMail,
          trigger: "change"
        }, {
          min: 0,
          max: 20,
          trigger: "change",
          message: "长度在20个字符"
        }],
        linkMan: [{
          min: 0,
          max: 50,
          trigger: "change",
          message: "长度在50个字符"
        }],
        remark: [{
          min: 0,
          max: 200,
          trigger: "change",
          message: "长度在200个字符"
        }]
      },
      show: false,
      categoryOptions: []
    }
  },
  props: ['sapSupplierInfo','mode'],
  methods: {
    getSaveMsg () {
    },
    getValidator () {
      var that = this;
      this.$refs["ruleForm"].validate((valid) => {
        if (valid) {
          //that.$emit("setDialogTitle","baseInfo");
          that.$emit("setRuleFormData", that.ruleForm);
        } else {
          return false;
        }
      });
    },
    setInfo () {
      if (this.sapSupplierInfo.mode == "add") {
        this.$set(this.ruleForm, 'country', this.sapSupplierInfo.selCountry);
        this.$set(this.ruleForm, 'address', this.sapSupplierInfo.selAddress);
        this.$set(this.ruleForm, 'area', this.sapSupplierInfo.selArea);
        this.$set(this.ruleForm, 'creditCode', this.sapSupplierInfo.creditCode);
        this.$set(this.ruleForm, 'mail', this.sapSupplierInfo.mail);
        this.$set(this.ruleForm, 'phone', this.sapSupplierInfo.phone);
        this.$set(this.ruleForm, 'fax', this.sapSupplierInfo.fax);
        this.$set(this.ruleForm, 'id', this.sapSupplierInfo.id);
        this.$set(this.ruleForm, 'address', this.sapSupplierInfo.address);
        this.$set(this.ruleForm, 'categoryCode', this.sapSupplierInfo.categoryCode);
        let isESign = this.sapSupplierInfo.isESign == 2 ? '认证通过' : this.sapSupplierInfo.isESign == 1 ? '认证中' : '未认证'
        this.$set(this.ruleForm, 'isESign', isESign);
        this.$set(this.ruleForm, 'supplierCode', this.sapSupplierInfo.supplierCode);
        this.$set(this.ruleForm, 'supplierName', this.sapSupplierInfo.supplierName);
        // this.$set(this.ruleForm,'linkMan',this.sapSupplierInfo.linkMan);
        // this.$set(this.ruleForm,'linkNumber',this.sapSupplierInfo.linkNumber);
      } else {
        const { isESign } = this.sapSupplierInfo
        this.ruleForm = {
          ... this.sapSupplierInfo,
          isESign: isESign == 2 ? '认证通过' : isESign == 1 ? '认证中' : '未认证'
        };
      }
    }
  },
  beforeMount () {
    this.categoryOptions = categoryCode
    this.setInfo();
  }
}
</script>